body {
background-image:
repeating-linear-gradient(120deg, rgba(255,255,255,.1), rgba(255,255,255,.1) 1px, transparent 1px, transparent 60px),
repeating-linear-gradient(60deg, rgba(255,255,255,.1), rgba(255,255,255,.1) 1px, transparent 1px, transparent 60px),
linear-gradient(60deg, rgba(0,0,0,.1) 25%, transparent 25%, transparent 75%, rgba(0,0,0,.1) 75%, rgba(0,0,0,.1)),
linear-gradient(120deg, rgba(0,0,0,.1) 25%, transparent 25%, transparent 75%, rgba(0,0,0,.1) 75%, rgba(0,0,0,.1));
background-size: 70px 120px;
}
.cerceve {
   width:960px;
   height:50px;
   margin: 50px auto;
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 20px;
   border-style:solid;
   border-width:3px;   
   background:
linear-gradient(27deg, #151515 5px, transparent 5px) 0 5px,
linear-gradient(207deg, #151515 5px, transparent 5px) 10px 0px,
linear-gradient(27deg, #222 5px, transparent 5px) 0px 10px,
linear-gradient(207deg, #222 5px, transparent 5px) 10px 5px,
linear-gradient(90deg, #1b1b1b 10px, transparent 10px),
linear-gradient(#1d1d1d 25%, #1a1a1a 25%, #1a1a1a 50%, transparent 50%, transparent 75%, #242424 75%, #242424);
background-color: #131313;
background-size: 20px 20px;
}
.cerceve > #sol {
   width:50px;
   height:50px;
   float:left;
   margin-top:-2px;
   overflow:hidden;
   background-color:#003333;
   border-top-left-radius: 20px 20px; 
   border-bottom-left-radius: 20px 20px; 
   box-shadow:0px 0px 0 rgb(202,202,202),0px 0px 0 rgb(158,158,158), 2px 2px 0 rgb(115,115,115),3px 3px 2px rgba(0,0,0,0.6),3px 3px 1px rgba(0,0,0,0.5),0px 0px 2px rgba(0,0,0,.2); 
background:
radial-gradient(black 15%, transparent 16%) 0 0,
radial-gradient(black 15%, transparent 16%) 8px 8px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
background-color:#282828;
background-size:16px 16px;
}
.cerceve > #sag {
   width:50px;
   height:50px;
   float:right;
   margin-top:-2px;
   background-color:#003333;
   border-top-right-radius: 20px 20px; 
   border-bottom-right-radius: 20px 20px;
   box-shadow:0px 0px 0 rgb(202,202,202),0px 0px 0 rgb(158,158,158), 2px 2px 0 rgb(115,115,115),3px 3px 2px rgba(0,0,0,0.6),3px 3px 1px rgba(0,0,0,0.5),0px 0px 2px rgba(0,0,0,.2); 
   background:
radial-gradient(black 15%, transparent 16%) 0 0,
radial-gradient(black 15%, transparent 16%) 8px 8px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
background-color:#282828;
background-size:16px 16px;
}
.cerceve > #perde {
   width:860px;
   height:50px;
   position:fixed;
   margin-left:50px;   
   margin-top:-2px;
   background-color:#666666;
   opacity:0.5;
   float:left;
   box-shadow:0px 0px 0 rgb(202,202,202),0px 0px 0 rgb(158,158,158), 2px 2px 0 rgb(115,115,115),3px 3px 2px rgba(0,0,0,0.6),3px 3px 1px rgba(0,0,0,0.5),0px 0px 2px rgba(0,0,0,.2);    
}
.cerceve > li {
  width:110px;
  height:50px;
  float:left;
  list-style:none;
  text-align:center;
  display:inline-block;  
  margin-left:10px;
}
.cerceve > li > a{
  width:100px;
  text-decoration:none;
  display:inline-block;
  color:#666666;
  padding-top:11px;
  font-size: 20px; 
  text-align:center;
  text-shadow:0px 0px 0 rgb(-104,-104,-104),1px 1px 0 rgb(-232,-232,-232), 2px 2px 0 rgb(-359,-359,-359),3px 3px 2px rgba(0,0,0,0),3px 3px 1px rgba(0,0,0,0.5),0px 0px 2px rgba(0,0,0,.2);   
}
.cerceve > li:hover > a{
  color:#FFFFFF;
}